<script setup lang='ts'>
import { onMounted, ref } from "vue";
import { getAggregateTitle } from "../api/api";
import { useRouter } from "vue-router";
const router = useRouter()
const searchData = ref();
const close = (e: string) => {
    router.push({name:'ThisData',query:{type:e}})
}
onMounted(async()=>{
    const res = await getAggregateTitle()
    searchData.value = res.data.data    
})
</script>

<template>
    <div class="tab">
        <van-tag class="ellipsis" color="rgb(218,220,224)" v-for="i in searchData" :key="i._id" type="primary"
            @click="close(i.name)">
            {{ i.name }}
        </van-tag>
    </div>
</template>

<style scoped>
.tab {
    width: 100%;
    box-sizing: border-box;
    padding: 12px;
    display: flex;
    flex-wrap: wrap;
}

.ellipsis {
    margin: 5px;
}
</style>